<?php
/**
 * The main template file
 *
 * This is the most generic template file in a WordPress theme
 * and one of the two required files for a theme (the other being style.css).
 * It is used to display a page when nothing more specific matches a query.
 * For example, it puts together the home page when no home.php file exists.
 *
 * @link
 *
 * @package WordPress
 * @subpackage shopstore
 * @since 2014
 */

get_header();?>
<div class="f-padding clearfix container_12" id="featured">
    <div class="banner featured-banner grid_8">
        <span class="star-ribbon star-ribbon-left red-ribbon"></span>
        <a href="#">
            <img alt="banner" src="<?php echo get_template_directory_uri();?>/images/images/banner-f1.jpg">          
        </a>
    </div>
    <div class="banner featured-banner banner-side grid_4 omega">
        <span style="background-image:url('<?php echo get_template_directory_uri();?>/images/custom-ribbon2.png')" class="custom-ribbon right-ribbon"></span>
        <span class="cover"></span>
        <img alt="banner" src="<?php echo get_template_directory_uri();?>/images/images/banner-f2.jpg">
        <a data-icon="" aria-hidden="true" class="icomoon link-icon"></a>
    </div>
    <div class="banner featured-banner banner-side grid_4 omega">
        <span style="background-image:url('<?php echo get_template_directory_uri();?>/images/custom-ribbon1.png')" class="custom-ribbon left-ribbon"></span>
        <span class="cover"></span>
        <img alt="banner" src="<?php echo get_template_directory_uri();?>/images/images/banner-f2.jpg">        
        <a data-icon="" aria-hidden="true" class="icomoon link-icon"></a>      
    </div>
</div>


<div class="homepage" id="main-container">
      <div class="floatted-box">      
        <div class="offers-box container_12">     
          <span class="blur-cover-left"></span>
          <span class="blur-cover-right"></span>
            <div class="flexslider">
              
            <div class="flex-viewport" style="overflow: hidden; position: relative;"><ul class="slides" style="width: 1200%; transition-duration: 0s; transform: translate3d(0px, 0px, 0px);">
                <li style="width: 234.5px; float: left; display: block;"><div class="tooltip-cover"><div class="tooltip"><span class="title">Orange Handbag</span><div class="price"><span class="old-price">$80.55</span><span class="new-price">$65.55</span></div></div></div><span class="cover"></span><a data-icon="" aria-hidden="true" class="icomoon heart" href="#"></a><a href="quick-view-template1.html" data-icon="◇" aria-hidden="true" rel="prettyPopin" class="icomoon eye"></a><a data-icon="" aria-hidden="true" class="  icomoon plus" href="product-fullwidth.html"></a><img alt="product-thumb" src="images/images/qview/1.jpg"></li>
                <li style="width: 234.5px; float: left; display: block;"><div class="tooltip-cover"><div class="tooltip"><span class="title">Sliver Watch</span><div class="price"><span class="reguler-price">$149.99</span></div></div></div><span class="cover"></span><a data-icon="" aria-hidden="true" class="icomoon heart" href="#"></a><a href="quick-view-template2.html" data-icon="◇" aria-hidden="true" rel="prettyPopin" class="icomoon eye"></a><a data-icon="" aria-hidden="true" class="icomoon plus" href="product-fullwidth.html"></a><img alt="product-thumb" src="images/images/qview/2.jpg"></li>
                <li style="width: 234.5px; float: left; display: block;"><div class="tooltip-cover"><div class="tooltip"><span class="title">Yellow Mini Car</span><div class="price"><span class="reguler-price">$19.65</span></div></div></div><span class="cover"></span><a data-icon="" aria-hidden="true" class="icomoon heart" href="#"></a><a href="quick-view-template3.html" data-icon="◇" aria-hidden="true" rel="prettyPopin" class="icomoon eye"></a><a data-icon="" aria-hidden="true" class="icomoon plus" href="product-fullwidth.html"></a><img alt="product-thumb" src="images/images/qview/3.jpg"></li>
                <li style="width: 234.5px; float: left; display: block;"><div class="tooltip-cover"><div class="tooltip"><span class="title">Red Handbag</span><div class="price"><span class="reguler-price">$80.55</span></div></div></div><span class="cover"></span><a data-icon="" aria-hidden="true" class="icomoon heart" href="#"></a><a href="quick-view-template4.html" data-icon="◇" aria-hidden="true" rel="prettyPopin" class="icomoon eye"></a><a data-icon="" aria-hidden="true" class="icomoon plus" href="product-fullwidth.html"></a><img alt="product-thumb" src="images/images/qview/4.jpg"></li>
                <li style="width: 234.5px; float: left; display: block;"><div class="tooltip-cover"><div class="tooltip"><span class="title">T-Shirt</span><div class="price"><span class="old-price">$75.75</span><span class="new-price">$50.99</span></div></div></div><span class="cover"></span><a data-icon="" aria-hidden="true" class="icomoon heart" href="#"></a><a href="quick-view-template5.html" data-icon="◇" aria-hidden="true" rel="prettyPopin" class="icomoon eye"></a><a data-icon="" aria-hidden="true" class="icomoon plus" href="product-fullwidth.html"></a><img alt="product-thumb" src="images/images/qview/5.jpg"></li>                
                <li style="width: 234.5px; float: left; display: block;"><div class="tooltip-cover"><div class="tooltip"><span class="title">Black Hells</span><div class="price"><span class="reguler-price">$24.99</span></div></div></div><span class="cover"></span><a data-icon="" aria-hidden="true" class="icomoon heart" href="#"></a><a href="quick-view-template6.html" data-icon="◇" aria-hidden="true" rel="prettyPopin" class="icomoon eye"></a><a data-icon="" aria-hidden="true" class="icomoon plus" href="product-fullwidth.html"></a><img alt="product-thumb" src="images/images/qview/6.jpg"></li>
              </ul></div><ul class="flex-direction-nav"><li><a href="#" class="flex-prev"></a></li><li><a href="#" class="flex-next"></a></li></ul></div>        
        </div>      
      </div><!-- end .floatted-box -->
      <div class="container_12 full-container">
        <div class="featured-module module clearfix">
          <div class="box-heading"><h3>Featured</h3></div>
            <!-- end .slides -->
      <div class="flex-viewport" style="overflow: hidden; position: relative;"><div class="slides" style="width: 1400%; transition-duration: 0s; transform: translate3d(0px, 0px, 0px);">
              <div class="product-box grid_3" style="width: 220px; float: left; display: block;">
              <span class="ribbon-sale"></span>
              <a href="product-sidebar.html" class="img-cover">
                <img alt="product-image" src="<?php echo get_template_directory_uri();?>/images/images/watch-grid.jpg">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img alt="5-stars-ratting" src="<?php echo get_template_directory_uri();?>/images/stars-5.png">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a data-icon="◠" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3" style="width: 220px; float: left; display: block;">
              <span class="ribbon-new"></span>
              <a href="product-sidebar.html" class="img-cover">
                <img alt="product-image" src="<?php echo get_template_directory_uri();?>/images/images/tshirt-2.jpg">
              </a>
              <div class="product-meta">
                <div class="title"><a href="product-sidebar.html">Product Name</a></div>
                <img alt="5-stars-ratting" src="<?php echo get_template_directory_uri();?>/images/stars-5.png">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a data-icon="◠" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3" style="width: 220px; float: left; display: block;">              
              <a href="product-sidebar.html" class="img-cover">
                <img alt="product-image" src="<?php echo get_template_directory_uri();?>/images/images/handbag-s.jpg">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img alt="5-stars-ratting" src="<?php echo get_template_directory_uri();?>/images/stars-5.png">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a data-icon="◠" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3" style="width: 220px; float: left; display: block;">              
              <a href="product-fullwidth.html" class="img-cover">
                <img alt="product-image" src="<?php echo get_template_directory_uri();?>/images/images/tshirt-1.jpg">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img alt="5-stars-ratting" src="<?php echo get_template_directory_uri();?>/images/stars-5.png">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a data-icon="◠" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3" style="width: 220px; float: left; display: block;">
              <span class="ribbon-new"></span>
              <span class="ribbon-sale"></span>
              <a href="#" class="img-cover">
                <img alt="product-image" src="<?php echo get_template_directory_uri();?>/images/images/handbag-black-grid.jpg">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img alt="5-stars-ratting" src="<?php echo get_template_directory_uri();?>/images/stars-5.png">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a data-icon="◠" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3" style="width: 220px; float: left; display: block;">
              <span class="ribbon-sale"></span>
              <a href="#" class="img-cover">
                <img alt="product-image" src="<?php echo get_template_directory_uri();?>/images/images/lego-trucks-grid.jpg">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img alt="5-stars-ratting" src="<?php echo get_template_directory_uri();?>/images/stars-5.png">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a data-icon="◠" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
            <div class="product-box grid_3" style="width: 220px; float: left; display: block;">
              <span class="ribbon-sale"></span>
              <a href="#" class="img-cover">
                <img alt="product-image" src="<?php echo get_template_directory_uri();?>/images/images/product-grid.jpg">
              </a>
              <div class="product-meta">
                <div class="title"><a href="#">Product Name</a></div>
                <img alt="5-stars-ratting" src="<?php echo get_template_directory_uri();?>/images/stars-5.png">
                <div class="price">
                  <span class="old-price">$589.50</span>
                  <span class="new-price">$250.50</span>                      
                </div>
              </div><!-- product-meta -->
              <ul class="product-action">
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Compare</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Wishlist</span>
                  </div>
                  <a data-icon="" aria-hidden="true" class="icomoon" href="#"></a>
                </li>
                <li>
                  <div class="tooltip-wrapper">
                    <span class="tooltip">Add To Cart</span>
                  </div>
                  <a data-icon="◠" aria-hidden="true" class="icomoon" href="#"></a>                    
                </li>
              </ul>
            </div><!-- .product-box -->
        </div></div><ul class="flex-direction-nav"><li><a href="#" class="flex-prev"></a></li><li><a href="#" class="flex-next"></a></li></ul></div><!-- .featured-module -->      
      <hr class="block-separator">
      <a href="http://themeforest.net/item/olympia-responsive-html5-ecommerce/4852725"><img alt="banner" src="<?php echo get_template_directory_uri();?>/images/banner.png"></a>
      <hr class="block-separator">
      <div class="latest-blog clearfix">
        <div class="box-heading"><h3>Latest News</h3>
          <a class="all-blog right" href="blog-listing.html">View All</a>
        </div>
        <article class="grid_4">
          <div class="meta">
            <span class="date"><span class="day">07</span><span class="month">MAY</span></span>
            <div class="title"><h4>News Title</h4><span><a href="#">News</a>,<a href="#">Offers</a>,<a href="#">Bestsellers</a></span></div>
          </div>
          <a href="<?php echo get_template_directory_uri();?>/images/images/latest-news-a.jpg" class="img-cover prettyphoto">
            <i data-icon="" aria-hidden="true" class="icomoon"></i>
            <img alt="news-image" src="<?php echo get_template_directory_uri();?>/images/images/latest-news-a.jpg">
          </a>
          <div class="excerpt">
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et</p>            
          </div>
          <a href="#" class="blog-link"><i data-icon="" aria-hidden="true" class="icomoon"></i>Read More</a>
        </article>
        <article class="grid_4">
          <div class="meta">
            <span class="date"><span class="day">07</span><span class="month">MAY</span></span>
            <div class="title"><h4>News Title</h4><span><a href="#">News</a>,<a href="#">Offers</a>,<a href="#">Bestsellers</a></span></div>
          </div>
          <a href="http://vimeo.com/24535181" class="img-cover prettyphoto">
            <i data-icon="" aria-hidden="true" class="icomoon"></i>
            <img alt="news-image" src="<?php echo get_template_directory_uri();?>/images/images/latest-news-b.jpg">
          </a>
          <div class="excerpt">
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et</p>            
          </div>
          <a href="#" class="blog-link"><i data-icon="" aria-hidden="true" class="icomoon"></i>Read More</a>
        </article>
        <article class="grid_4 omega">
          <div class="meta">
            <span class="date"><span class="day">07</span><span class="month">MAY</span></span>
            <div class="title"><h4>News Title</h4><span><a href="#">News</a>,<a href="#">Offers</a>,<a href="#">Bestsellers</a></span></div>
          </div>
          <a href="#" class="img-cover"><img alt="news-image" src="<?php echo get_template_directory_uri();?>/images/images/latest-news-c.jpg"></a>
          <div class="excerpt">
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et</p>            
          </div>
          <a href="#" class="blog-link"><i data-icon="" aria-hidden="true" class="icomoon"></i>Read More</a>
        </article>
        </div><!-- end .latest-blog -->        
      </div><!-- end .container_12 -->
      <div class="base-info">
        <div class="container_12">
          <div class="info-block grid_4">
            <span data-icon="" aria-hidden="true" class="icomoon"></span>
            <div class="base-info-data">
              <h4>SAFE &amp; SECURE</h4>
              <span>Consectetur adipisicing elit,</span>
            </div>
          </div>
          <div class="info-block grid_4">
            <span data-icon="◟" aria-hidden="true" class="icomoon"></span>
            <div class="base-info-data">
              <h4>SUPORT 24/7 </h4>
              <span class="phone-number">+213-123-456-7890</span>
            </div>
          </div>
          <div class="info-block grid_4 omega">            
            <span data-icon="" aria-hidden="true" class="icomoon"></span>
            <div class="base-info-data">
              <h4>FREE SHIPPING</h4>
              <span>adipisicing elit, sed do eiusmod </span>
            </div>
          </div>
        </div>
      </div><!-- end .base-info -->
    </div>
<?php get_footer();?>